<template>
    <el-card shadow="hover">
        <el-table
                :data="students"
                style="width: 100%">
            <el-table-column
                    label="学号"
                    align="center"
                    prop="sid"
                    width="180">
            </el-table-column>
            <el-table-column
                    label="姓名"
                    align="center"
                    prop="sname"
                    width="180">
            </el-table-column>
            <el-table-column
                    label="性别"
                    align="center"
                    prop="sex"
                    width="180">
            </el-table-column>
            <el-table-column
                    label="年龄"
                    align="center"
                    prop="age"
                    width="180">
            </el-table-column>
            <el-table-column
                    label="住址"
                    align="center"
                    prop="addr"
                    width="180">
            </el-table-column>
            <el-table-column
                    label="所在班级"
                    align="center"
                    prop="cname"
                    width="180">
            </el-table-column>
            <el-table-column label="操作" align="center">
                <template slot-scope="scope">
                    <el-button
                            size="mini"
                            @click="handleEdit(scope.$index, scope.row)">编辑
                    </el-button>
                    <el-button
                            size="mini"
                            type="danger"
                            @click="handleDelete(scope.$index, scope.row)">删除
                    </el-button>
                </template>
            </el-table-column>
        </el-table>
    </el-card>
</template>

<script>
    export default {
        name: "Student",
        data() {
            return {
                students: []
            }
        },
        created() {
            //1. 查询所有学生
            this.findStudents();
        },
        methods: {
            //1. 查询所有学生
            findStudents(){
                this.$axios.get("/student?cmd=list").then(resp=>{
                    this.students = resp.data
                })
            },
            handleEdit(index, row) {
                console.log(index, row);
            },
            handleDelete(index, row) {
                console.log(index, row);
            }
        }
    }
</script>

<style scoped>

</style>